<template>
  <div class="page">
    <search @search="search"></search>
    <div class="content">
      <navigator url="/pages/yushou/main">
        <div class="weui-flex">
          <div class="weui-flex__item side">
            <img class="side-img" src="/static/images/img/home1.png" alt="">
          </div>
          <ul class="weui-flex__item main">
            <li class="back">春秋韩国定制童装</li>
            <li class="gery">衣服的描述，大小的描述</li>
            <li class="gery main-flex">
              <text >尺寸大小：80-130</text>
              <text class="main-flex-right">重量：120g</text>
            </li>
            <li class="gery">￥120&nbsp;&nbsp;￥360&nbsp;&nbsp;  (一手4件)</li>
          </ul>
        </div>
      </navigator>

      <div class="page__bd page__bd_spacing">
      <div class="weui-flex">
        <div class="weui-flex__item side">
          <img class="side-img" src="/static/images/img/home1.png" alt="">
        </div>
        <ul class="weui-flex__item main">
          <li class="back">春秋韩国定制童装</li>
          <li class="gery">衣服的描述，大小的描述</li>
          <li class="gery main-flex">
            <text >尺寸大小：80-130</text>
            <text class="main-flex-right">重量：120g</text>
          </li>
          <li class="gery">￥120&nbsp;&nbsp;￥360&nbsp;&nbsp;  (一手4件)</li>
        </ul>
      </div>
    </div>

      <div class="page__bd page__bd_spacing">
      <div class="weui-flex">
        <div class="weui-flex__item side">
          <img class="side-img" src="/static/images/img/home1.png" alt="">
        </div>
        <ul class="weui-flex__item main">
          <li class="back">春秋韩国定制童装</li>
          <li class="gery">衣服的描述，大小的描述</li>
          <li class="gery main-flex">
            <text >尺寸大小：80-130</text>
            <text class="main-flex-right">重量：120g</text>
          </li>
          <li class="gery">￥120&nbsp;&nbsp;￥360&nbsp;&nbsp;  (一手4件)</li>
        </ul>
      </div>
    </div>

      <div class="page__bd page__bd_spacing">
      <div class="weui-flex">
        <div class="weui-flex__item side">
          <img class="side-img" src="/static/images/img/home1.png" alt="">
        </div>
        <ul class="weui-flex__item main">
          <li class="back">春秋韩国定制童装</li>
          <li class="gery">衣服的描述，大小的描述</li>
          <li class="gery main-flex">
            <text >尺寸大小：80-130</text>
            <text class="main-flex-right">重量：120g</text>
          </li>
          <li class="gery">￥120&nbsp;&nbsp;￥360&nbsp;&nbsp;  (一手4件)</li>
        </ul>
      </div>
    </div>

      <div class="page__bd page__bd_spacing">
      <div class="weui-flex">
        <div class="weui-flex__item side">
          <img class="side-img" src="/static/images/img/home1.png" alt="">
        </div>
        <ul class="weui-flex__item main">
          <li class="back">春秋韩国定制童装</li>
          <li class="gery">衣服的描述，大小的描述</li>
          <li class="gery main-flex">
            <text >尺寸大小：80-130</text>
            <text class="main-flex-right">重量：120g</text>
          </li>
          <li class="gery">￥120&nbsp;&nbsp;￥360&nbsp;&nbsp;  (一手4件)</li>
        </ul>
      </div>
    </div>
    </div>
  </div>
</template>
<script>
  import search from '@/components/search'
  export default {
    data () {
      return {
        data: ''
      }
    },
    components: {
      search
    },
    methods: {
      search (data) {
        this.data = data
        console.log('data:' + this.data)
      }
    },
    mounted () {
    }
  }
</script>
<style lang="less" rel="stylesheet/less"  scoped>
  .page{
    height: 100vh;
    font-size: 32rpx;
    background: #F7F7F7;
  }
  .content{
    height:calc(100vh - 96rpx);
    overflow:scroll;
  }
  .weui-flex{
    padding: 20rpx 50rpx;
    .side{
      width: 200rpx;
      height: 200rpx;
      flex-grow: 0;
      .side-img{
        width: 200rpx;
        height: 200rpx;
      }
    }

    .main{
      padding: 20rpx;
      .gery{
        font-size: 24rpx;
        line-height:40rpx;
        color:#7D7C7C;
      }
      .main-flex{
        display: flex;
        text{
          display: block;
          flex-grow: 1;
        }
        .main-flex-right{
            text-align: right;
        }
      }
    }
  }

</style>
